<!DOCTYPE html>
<html lang="en">
  <head>
	<!-- <title><%= t :title %></title> -->

    <title>COFFEE 2 GO</title>
    <%= csrf_meta_tag %>

  	<%= stylesheet_link_tag    "application", :media => "all" %>
  	<%= javascript_include_tag "application" %>
  	<%= csrf_meta_tags %>
    <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="/lib/angular/angular.min.js"></script>
    <script type="text/javascript" src="/bootstrap/js/bootstrap.min.js"></script>
    <script src="/js/index.js" type="text/javascript"></script>
	
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="generator" content="CSE HTML Validator (http://www.htmlvalidator.com/)">
    <link rel="stylesheet" type="text/css" href="/style.css">
    <script type="text/javascript">
      function about() {
        info = document.getElementById('about-content');
        if (window.XMLHttpRequest)
          { xhr = new XMLHttpRequest(); }
        else
          { xhr = new ActiveXObject("Microsoft.XMLHTTP"); }
        xhr.open("GET","rails/info/properties",false);
        xhr.send("");
        info.innerHTML = xhr.responseText;
        info.style.display = 'block'
      }
    </script>

    <script type="text/javascript">
		/*
		--Do not remove this if you are using--
		-Author: Van Khuong
		-Author URL: http://www.sothichweb.com
		-Published date: 2012/06/21
		-Tutorial: http://sothichweb.com/article/slider_don_gian_voi_jQuery/03d05da
		*/
		$(document).ready(function(){
			vk_slideshow(2800);

		});
		function slideshow(prev){
			var slides = $('#slideshow li');
			var currElem = slides.filter('.current');
			var lastElem = slides.filter(':last');
			var firstElem = slides.filter(':first');
			// Xác định phần tử kế tiếp là prev hay next
			var nextElem = (prev)? currElem.prev() : currElem.next();
			if(prev){
				if(firstElem.attr('class') == 'current') nextElem = lastElem;
			}else if(lastElem.attr('class') == 'current')nextElem = firstElem;
			
			fadeElem(currElem,nextElem);
			widegetStatus(slides);
		}
		function wideget(index){
			var slides = $('#slideshow li');
			var currElem = slides.filter('.current');
			var nextElem = slides.eq(index);

			fadeElem(currElem,nextElem);
			widegetStatus(slides);
		}
		function widegetStatus(slides){
			slides.each(function(index){
				if($(this).attr('class') == 'current')
					$('#controlNav a').removeClass('active').eq(index).addClass('active');
			});
		}
		function fadeElem(currElem,nextElem){
		if(!$.browser.msie){
			currElem.removeClass('current').find('img') .css({'z-index':'50'}) .end() .find('p') .css({'z-index':'50'});
			nextElem.addClass('current').find('img') .css({'opacity': '0','z-index':'100'}) .animate({opacity: 1}, 700, function(){
				currElem.find('img') .css({'z-index': '0'});
			}).end().find('p') .css({'height':'0','z-index':'100','opacity': '0'}).delay(2) .animate({height: 50,opacity: 1},500, function(){
				currElem.find('p') .css({'z-index': '0'});
			});
		}else{
			currElem.removeClass('current').find('img') .css({'z-index':'50'}) .end() .find('p') .css({'z-index':'50'});
			nextElem.addClass('current').find('img') .css({'opacity': '0','z-index':'100'}) .animate({opacity: 1}, 700, function(){
				currElem.find('img') .css({'z-index': '0'});
			}).end().find('p') .css({'height':'0','z-index':'100'}).delay(2) .animate({height: 50},500, function(){
				currElem.find('p') .css({'z-index': '0'});
			});
		}
		}
		function vk_slideshow(time){
			var idset =setInterval('slideshow()', time);

			var liarr =$('#slideshow ul li');
			var controlNav =$('#controlNav');
			var str='';
			for(var i=0; i<liarr.length; i++){
				str+='<a></a>';
			}
			controlNav.append(str);
			controlNav.children().each(function(index){
				$(this).click(function(){
					wideget(index);clearInterval(idset);
					idset =setInterval('slideshow()', time);
				});
			}).eq(0).addClass('active');

			$('#next').click(function(){
				slideshow(); clearInterval(idset);
				idset =setInterval('slideshow()', time);
			});
			$('#prev').click(function(){
				slideshow(true); clearInterval(idset);
				idset =setInterval('slideshow()', time);
			});
		}
	</script>
  </head>
  <body>

  <div id="portalOuterContainer">
	<div id="mid">
		<div id="wrapper">
			<div class="navbar navbar-inverse" style="position: static;" >
				<div class="navbar-inner">
					<div class="container">
						<a class="btn btn-navbar" data-toggle="collapse" data-target=".subnav-collapse">
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
						</a>
						<a class="brand" <%= link_to "#{t :home}", root_path%></a>
						<div class="nav-collapse subnav-collapse">
							<ul class="nav">
							<% @url_phat=root_path %>
							<%- # TAb Gioi thieu-%>
							<li class="dropdown">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown"><%= t :introduce %><b class="caret"></b></a>
								<ul class="dropdown-menu">
							        <li><%= link_to "#{t :introduce}", introduce_path %></li>
									<li><%= link_to "#{t :huongdansudung}", help_path %></li>
							        <li><%= link_to "#{t :thongtinnhansu}",staff_path %></li>
									<li class="divider"></li>
									<li class="nav-header"><%= t :trogiup %></li>
							        <li><%= link_to "#{t :lienhe}", contact_path %></li>
									<li><a href="<%=@url_phat%>/answer"><%= t :giaidapthacmac %></a></li>
									<li><a href="<%=@url_phat%>/users/feedback"><%= t :phanhoi %></a></li>
								</ul>
							</li>

							<%- # TAb Quan ly-%>					
							<% if((session[:user_id])!=nil) %>
								<% @user = User.find(session[:user_id]) %>
								<% if(@user.GroupUserId==10) %>
								 <li class="dropdown">
									<a href="#" class="dropdown-toggle" data-toggle="dropdown"><%=t :manage %> <b class="caret"></b></a>
									<ul class="dropdown-menu">
										<% if((session[:user_id])!=nil) %>
										<% @user = User.find(session[:user_id]) %>
										<% if(@user.GroupUserId==10) %>
										<li><a href="<%=@url_phat%>/borrowedtables/extension"><%= t :giahan%></a></li>
										<%end%>			
										<%end%>
										<li><%= link_to "#{t :qlthemnuoc}", new_product_path%></li>
										<li><%= link_to "#{t :themhinhanhnuoc}", new_product_image_path%></li
										<li><%= link_to "#{t :themloainuocmoi}", new_category_path %></li>
										<li class="divider"></li>
										<li class="nav-header"><%= t :qlxoa %></li>
										<% if((session[:user_id])!=nil) %>
											<% @user = User.find(session[:user_id]) %>
											 <% if(@user.GroupUserId==10) %>
												<li><%= link_to "#{t :qlxoanguoidung}", users_path%></li>
											<%end%>				
										<%end%>

									</ul>
								</li>
								<%end%>
							<%end%>

							<%- # TAb Trang ca nhan-%>
							<% if((session[:user_id])!=nil) %>
								<li class="dropdown">
									<a href="#" class="dropdown-toggle" data-toggle="dropdown"><%= t :myprofile %><b class="caret"></b></a>
									<ul class="dropdown-menu">
										<li><%= link_to "#{t :doithongtincanhan}", edit_user_path(@user)%></li>
									</ul>
								</li>
							<%end%>


							<%- # TAb Thao tac-%>
							<li class="dropdown">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown"><%= t :thaotac %> <b class="caret"></b></a>
								<ul class="dropdown-menu">
									<li><a href="<%=@url_phat%>/products/require"><%= t :yeucaunuocmoi %></a></li>
									<li><%= link_to "#{t :hinhanhnuoc}", product_images_path%></li>
									<li class="divider"></li>
									<li class="nav-header"><%= t :giohang %></li>
								</ul>
							</li>						
							</ul>

							<ul id="m">
								<li><a href="/vi"><img src="/images/index/vn.jpg" alt="Tieng Viet" width="20" height="15" ></a></li>
								<li><a href="/en"><img src="/images/index/anh.jpg" alt="Tieng Anh" width="20" height="15"></a></li>
							</ul>						   
							<ul class="nav pull-right">
								<% if(session[:user_id]==nil) %>
									<%= link_to "#{t :dangnhap}", login_path%>/
									<%= link_to "#{t :dangky}", new_user_path%>
								<% end%>
								<% if(session[:user_id]!=nil) %>
									<% @user = User.find(session[:user_id]) %>
									<%=t :hello %> <%= @user.lastName %>
									<%= link_to "#{t :quit}", logout_path %>
								<% end %>	
							</ul>
						</div><!-- /.nav-collapse -->
					</div>
				</div><!-- /navbar-inner -->
			</div>
			<div id="banner">
					<div id="slider">
						<div id="slideshow">
							<ul>
								<li class="current">
									<img src="/images/slideshow/1.jpg" width = "1100" height = "300" /><p><span></span></p>
								</li>
								<li>
                                	<img src="/images/slideshow/2.jpg" width = "1100" height = "300" /><p><span></span></p>
								</li>
								<li>
                                	<img src="/images/slideshow/3.jpg" width = "1100" height = "300" /><p><span></span></p>
								</li>
								<li>
                                	<img src="/images/slideshow/4.jpg" width = "1100" height = "300" /><p><span></span></p>
								</li>
								<li>
									<img src="/images/slideshow/5.jpg " width = "1100" height = "300" /><p><span></span></p>
								</li>
								<li>
									<img src="/images/slideshow/6.jpg" width = "1100" height = "300"/><p><span></span></p>
								</li>
								<li>
									<img src="/images/slideshow/7.jpg" width = "1100" height = "300"/><p><span></span></p>
								</li>                              
							</ul>
                            <span id="prev">prev</span>
                            <span id="next">next</span>
                            <p id="controlNav"></p>
						</div>
					</div>
			</div><!--End banner-->	  
			<div id="contain">
				<div id="adv">

				<%= form_tag products_path, :action => 'searchCategory',:method => 'get' do %>
				  <% @category = Category.find(:all, :id) %>
				  <% array   = @category.map {|p| [ p.Name  ] }%>
				  <h6><%= select_tag "searchCategory", options_for_select(array), :style => "width:190px" %>
				  <p><%= submit_tag "#{t :show}" %></p></h6>
				<%end%>
<!--End Tim kiem theo the loai -->
					<div id ="t">
						<h1><%= t :_top %></h1>
					</div><!--End t -->
        		
                    <!--Phat: Hien thi 5 loai sach moi nhat-->
                	<% @n = Product.count %>
                	<% @product1 = Product.find(1) %>
                	<% @product2 = Product.find(4) %>
                	<% @product3 = Product.find(8) %>
                	<% @product4 = Product.find(15) %>
                	<% @product5 = Product.find(18) %>
                	
                	<!--san pham 1-->
                	<td><p><h6><%= link_to "#{@product1.Name}", @product1 %></h6></p></td>
                	<% @p1 = ProductImage.find_by_product_id(@product1.product_id)%> 
                	<%if(@p1!=nil)%>
                	<% @p11 = @p1.image%>     
                	<%end%>
					<div class="product_image">
						<%= link_to image_tag("/assets/#{@p11}", :border => 0,:width =>279, :height => 190, :alt => "#{@product1.Name}"), @product1%>
					</div>

					<!--san pham 2 	-->
					<td><p><h6><%= link_to "#{@product2.Name}", @product2 %></h6></p></td>  
					<% @p2 = ProductImage.find_by_product_id(@product2.product_id)%> 
                	<%if(@p2!=nil)%>
                	<% @p22 = @p2.image%>     
                	<%end%>        
					<div class="product_image">
						<%= link_to image_tag("/assets/#{@p22}", :border => 0,:width =>279, :height => 190, :alt => "#{@product2.Name}"), @product2%>
					</div>

					<!--san pham 3 -->
					<td><p><h6><%= link_to "#{@product3.Name}", @product3 %></h6></p></td> 
					<% @p3 = ProductImage.find_by_product_id(@product3.product_id)%> 
                	<%if(@p3!=nil)%>
                	<% @p33 = @p3.image%>     
                	<%end%>            
					<div class="product_image">
						<%= link_to image_tag("/assets/#{@p33}", :border => 0,:width =>279, :height => 190, :alt => "#{@product3.Name}"), @product3%>
					</div>

					<!--san pham 4-->
					<td><p><h6><%= link_to "#{@product4.Name}", @product4 %></h6></p></td>          
					<% @p4 = ProductImage.find_by_product_id(@product4.product_id)%> 
                	<%if(@p4!=nil)%>
                	<% @p44 = @p4.image%>     
                	<%end%> 
					<div class="product_image">
						<%= link_to image_tag("/assets/#{@p44}", :border => 0,:width =>279, :height => 190, :alt => "#{@product4.Name}"), @product4%>
					</div>

					<!--san pham 5-->
					<td><p><h6><%= link_to "#{@product5.Name}", @product5 %></h6></p></td>         
					<% @p5 = ProductImage.find_by_product_id(@product5.product_id)%> 
                	<%if(@p5!=nil)%>
                	<% @p55 = @p5.image%>     
                	<%end%>   
					<div class="product_image">
						<%= link_to image_tag("/assets/#{@p55}", :border => 0,:width =>279, :height => 190, :alt => "#{@product5.Name}"), @product1%>
					</div>
					<!-- Hien thi 5 loai sach moi nhat End-->

					<div id="b">

					</div><!--End b-->
				</div><!--End adv-->

				<div id="slidebar">
          
					<ul id="list">						
<!-- Phat: Tab Tim kiem -->
						<select  name="lists" size="0.5" onchange="window.open(this.options[this.selectedIndex].value,'_top'); lists.options[0].selected=true" style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 10pt; width:150px">
					    <option selected ><%= t :timvaloc%></option>
					    <option value="<%=@url_phat%>/products/search/NameOfDrink"><%= t :timkiemtennuoc %></option>
					  	</select> 
					  
<!-- End tab Tim kiem -->
						<li><a href="<%=@url_phat%>/news" ><img src="/images/bar/news.jpg" alt="News" width="200" height="50"/></a></li>
						<img src="/images/adv/bk_quangcao.png" alt="BK_logo" width="150" height="150"/><br><br>
						<img src="/images/adv/nescafe.jpg" alt="thuvien_logo" width="150" height="150"/><br><br>
						<img src="/images/adv/trungnguyen.jpg" alt="book_logo" width="150" height="150"/><br><br>
						<img src="/images/adv/thuha.jpg" alt="bk55_logo" width="150" height="150"/><br><br>
						<img src="/images/adv/starbucks.jpg" alt="bk55_logo" width="150" height="150"/>
            			<br><br><br><br>

            			
            			<select  name="lists" size="0.5" onchange="window.open(this.options[this.selectedIndex].value,'_top'); lists.options[0].selected=true" style="font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 10pt; width:150px">
					    <option selected value="/Links"><%= t :lienket%></option>
					    <option value="http://www.nhaccuatui.com/"><%= t :nhaccuatui %></option>
					  	</select>

					  	
<!--Phat : dem so luong thanh vien truy cap -->
					  	<% @user = User.all %>
					  	<% @nUser = 0 %>
					  	<% @user.each do |user| %>
					  		<%if(session[:user_id]== user.id)%>
					  			<% @nUser = @nUser +1 %>
					  		<%end%>
					  	<%end%>
					  	<h12><font style="font-size:15px;font-weight:bold"><%= t :sotruycap%></font> <%= @nUser%></h12>

					  	

					</ul><!--End list-->

				</div><!--End slidebar-->

				<div id="main">
					<%= yield %>
				</div><!--End main-->
				
			</div><!--End contain-->
		</div><!-- End wrapper-->
	</div><!--End mid-->
  
	<div id="footer">
		<div align = "center" class="logingfy"><span><h7><%= t :mxh%></h7></span>
          <a href="http://www.facebook.com"><img src="/images/index/face_lg.png" ></a>
          <a href="http://www.google.com.vn"><img src="/images/index/google_lg.png"></a>
          <a href="http://www.yahoo.com.vn"><img src="/images/index/yahoo_lg.png"></a>
          <div class="clr"></div>
	</div>
		<h1>&copy COPYRIGHT 2013: <span>PPL</span></h1>
	</div><!--End footer-->
  </div>
</body>
</html>